<div class="modal-header">
  <h2>
    Map Controls to <small>{{section.slug}}</small>
    <i class="grcicon-section"></i><i class="grcicon-reg-map-white"></i><i class="grcicon-control"></i>
  </h2>
</div>


<div class="modal-filter">
    <div class="row-fluid">
      <div class="span3">
        &nbsp;
      </div>
      <div class="span6">
        <div class="span7">
          <div class="modal-search">
            <a class="btn btn-mini search-reset" href="javascript://">
              <i class="grcicon-x-grey"></i>
            </a>
            <input class="input-block-level widgetsearch-tocontent clear-value" placeholder="Search controls" type="text" />
          </div>
        </div>
        <div class="span5 checkbox-filter">
          <input type="checkbox" id="control-type-filter" class="control-type-filter inline pull-right" checked="checked"/>
          <label class="inline pull-right" for="control-type-filter">Controls for this {{parent_subtype}} only:</label>
        </div>
      </div>
      <div class="span3">
        <div class="pull-right">
          <a class="btn btn-add" data-dirty="#controls, #combo" href="/controls/new?{{parent_type}}_id={{parent_id}}" data-modal-class="modal-wide" data-toggle="modal-ajax-form" rel="tooltip" data-original-title="Create New Control">
            <i class="grcicon-add"></i>
            Control
          </a>
        </div>
      </div>
    </div>
  </div>

<div class="modal-content" data-section-id="{{section.id}}">
    <div class="row-fluid">
      {{#section}}
      <div class="span3">
        <div class="selector-info selector-info-left">
          <h4>
            <i class="grcicon-section-color"></i>
            {{title}}
          </h4>
          <p class="code governance">{{slug}}</p>
          <div class="rtf">
            {{{description}}}
          </div>
          <h5>
            Already Mapped Controls ({{linked_controls.length}})
          </h5>
          {{#if linked_controls.length}}
            <ul class="linked-controls">
              {{#linked_controls}}
              <li>
                <a href="javascript://" class="jump-to-control" data-content-id="{{content_id}}">
                  {{#pack this}}
                    {{! careful to avoid using the section's title or slug here, especially when the controls haven't loaded yet }}
                    <span>{{firstnonempty control.title title}}</span>
                    <small>{{firstnonempty control.slug slug}}</small>
                  {{/pack}}
                </a>
              </li>
              {{/linked_controls}}
            </ul>
          {{/if}}
          {{#unless linked_controls.length}}
            <ul class="linked-controls">
              <li class="not-applicable">
                <input type="checkbox" id="section_na" {{#if na}}checked="checked"{{/if}}>
                <strong>Controls are not applicable (N/A)</strong>
              </li>
            </ul>
            
          {{/unless}}
        </div>
      </div>
      {{/section}}
      <div class="span6">
        <div class="search-title">
          <div class="row-fluid">
            <div class="span6">
              <h4>
                Search Results <span class="search-results-count">0</span>
              </h4>
            </div>
            <div class="span6">
              <div class="guide">map/unmap</div>
            </div>
          </div>
        </div>
        {{! this is filled in with the controls controller}}
        <div class="content controls-list selector-list source" data-list-data-href="/controls.json"/>
        
      </div>
      <div class="span3">
        <div class="selector-info selector-info-right control">
          {{!this is filled in with the selected control controller}}
        </div>
      </div>
    </div>
  </div>

<div class="modal-footer">
  <div class="row-fluid">
    <nav class="span6">
      <!-- <input class="btn btn-large btn-info closebtn" name="commit" type="button" value="Cancel"> -->
    </nav>
    <nav class="span6">
      <div class="confirm-buttons">
        <div class="btn closebtn btn-primary" data-dismiss="modal"> Done </div>
      </div>
    </nav>
  </div>
</div>

